<template>
     <div class="administer">
        <div class="administerNav">
            <backHeader></backHeader>
        </div>
        <div class="administerCont2">
            <div class="html_pst">
                <div class="input_edit">
                    <!-- <div class="font26">产品信息录入/编辑</div>  -->
                    <el-form @submit.native.prevent :inline="true" class="demo-form-inline pop-up" label-width="116px">
                        <div class="lists">
                            <el-form-item label="系列名称：">
                                <span>{{seriesInfo.seriesName}}</span>
                            </el-form-item>
                            <el-form-item label="品牌名称：">
                               <span>{{seriesInfo.brandName}}</span>
                            </el-form-item>
                        </div>
                        <div class="lists1">
                            <el-form-item label="灯具型号：">
                                 <el-autocomplete
                                class="inline-input"
                                v-model="form.modelName"
                                :fetch-suggestions="querySearch"
                                placeholder="请输入内容"
                                :trigger-on-focus="false"
                                @select="handleSelect"
                                @keyup.enter.native="cancelEnter()"
                            ></el-autocomplete><span style="color:red" class="ason">*</span>
                            </el-form-item>
                             <el-form-item label="灯具编号：">
                                <el-input v-model="form.modelCode"  @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                             <el-form-item label="灯具颜色：">
                                 <el-popover ref="popover1" placement="bottom" width="60" trigger="focus" popper-class="acves">
                                     <ul class="wid100">
                                        <li v-for="(item, index) in dengjuyanseList"
                                            :data-index="index"
                                            @click="setCol(item,index)"
                                            :key="index"
                                            >
                                            {{item.dictCont}}
                                        </li>
                                    </ul>
                                </el-popover> 
                                <el-input v-model="form.lumColor" v-popover:popover1 @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                             <el-form-item label="灯具材质：">
                                 <el-popover ref="popover2" placement="bottom" width="60" trigger="focus" popper-class="acves">
                                     <ul class="wid100">
                                        <li v-for="(item, index) in dengjucaizhiList"
                                            :data-index="index"
                                            @click="setCol1(item,index)"
                                            :key="index"
                                            >
                                            {{item.dictCont}}
                                        </li>
                                    </ul>
                                </el-popover> 
                                <el-input v-model="form.lumMaterial" v-popover:popover2 @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                            <el-form-item label="灯具类型：">
                                <el-select v-model="form.lumType">
                                     <el-option
                                        v-for="item in lampTypeList"
                                        :key="item.id"
                                        :label="item.lampName"
                                        :value="item.id"
                                    ></el-option>
                                </el-select><span style="color:red" class="ason">*</span>
                            </el-form-item>
                             <el-form-item label="光源种类：">
                                <el-input v-model="form.lightType" @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                             <el-form-item label="表面最高温度(℃)：">
                                <el-input v-model="form.surfaceTemp" @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                            <el-form-item label="IP等级：">
                                <el-popover ref="popover3" placement="bottom" width="60" trigger="focus" popper-class="acves">
                                     <ul class="wid100">
                                        <li v-for="(item, index) in ipdengjiList"
                                            :data-index="index"
                                            @click="setIp(item,index)"
                                            :key="index">
                                            {{item.dictCont}}
                                        </li>
                                    </ul>
                                </el-popover>
                                <el-input v-model="form.ipGrade" v-popover:popover3 @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                            <el-form-item label="光源品牌：">
                                <el-popover ref="popover4" placement="bottom" width="60" trigger="focus" popper-class="acves">
                                     <ul class="wid100">
                                        <li v-for="(item, index) in guangyuanpinpaiList"
                                            :data-index="index"
                                            @click="setlightBrand(item,index)"
                                            :key="index">
                                            {{item.dictCont}}
                                        </li>
                                    </ul>
                                </el-popover> 
                                <el-input v-model="form.lightBrand" v-popover:popover4 @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                            <el-form-item label="光源功率(W)：">
                                <el-input v-model="form.lightPower" @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                             <el-form-item label="灯具效率：">
                                <el-input v-model="form.xiaoLv" @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                             <el-form-item label="70%光衰承诺(hr)：">
                                <el-input v-model="form.guangShuai" @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                             <el-form-item label="灯具功率(W)：" >
                                <el-input v-model="form.lumPower" @keyup.enter.native="cancelEnter()" ></el-input><span style="color:red" class="ason">*</span>
                            </el-form-item>
                             <el-form-item label="电压(V)：">
                                <el-input v-model="form.voltage" @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                             <el-form-item label="支架高度(mm)：">
                                <el-input v-model="form.zhijiaHeight" onkeyup="value=value.replace(/[^\d]/g,'')" @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                             <el-form-item label="重量(KG)：">
                                <el-input v-model="form.weight" @blur="proving()" @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                             <el-form-item label="色温颜色：">
                                <el-popover ref="popover5" placement="bottom" width="60" trigger="focus" popper-class="acves">
                                     <ul class="wid100">
                                        <li v-for="(item, index) in sewenyanseList"
                                            :data-index="index"
                                            @click="setTemperature(item,index)"
                                            :key="index">
                                            {{item.dictCont}}
                                        </li>
                                    </ul>
                                </el-popover>
                                <el-input v-model="form.colorTemp" v-popover:popover5  @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                            <el-form-item label="显指Ra：">
                                <el-input v-model="form.ra" onkeyup="value=value.replace(/[^\d]/g,'')" @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                            <el-form-item label="灯具尺寸(mm)：" class="showM">
                                <div class="srcmm">长：</div>
                                <el-input v-model="form.lumLong" onkeyup="value=value.replace(/[^\d]/g,'')" @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                            <el-form-item label="开孔尺寸(mm)：" class="showM">
                                <div class="srcmm">长：</div>
                                <el-input v-model="form.kaikongLong" onkeyup="value=value.replace(/[^\d]/g,'')" @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                            <el-form-item label="光束角(°)：">
                                <el-input v-model="form.lightAngle"  @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                            <el-form-item label="光通量(lm)：">
                                <el-input v-model="form.guangTongLiang" onkeyup="value=value.replace(/[^\d]/g,'')" @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                            <el-form-item label="灯具尺寸(mm)：" class="hidenM">
                                <div class="srcmm">宽：</div>
                                <el-input v-model="form.lumWidth" onkeyup="value=value.replace(/[^\d]/g,'')" @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                            <el-form-item label="开孔尺寸(mm)：" class="hidenM">
                                <div class="srcmm">宽：</div>
                                <el-input v-model="form.kaikongWidth" onkeyup="value=value.replace(/[^\d]/g,'')" @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>

                             <el-form-item label="控制方式：">
                                <el-popover ref="popover6" placement="bottom" width="60" trigger="focus" popper-class="acves">
                                     <ul class="wid100">
                                        <li v-for="(item, index) in kongzhifangshiList"
                                            :data-index="index"
                                            @click="setControl(item,index)"
                                            :key="index">
                                            {{item.dictCont}}
                                        </li>
                                    </ul>
                                </el-popover>
                                <el-input v-model="form.controlTypeStr" v-popover:popover6  @keyup.enter.native="cancelEnter()" ></el-input><span style="color:red" class="ason">*</span>
                            </el-form-item>
                            <el-form-item label="电源：">
                                <el-input v-model="form.electric" @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                            <el-form-item label="灯具尺寸(mm)：" class="hidenM">
                                <div class="srcmm">高：</div>
                                <el-input v-model="form.lumHeight" onkeyup="value=value.replace(/[^\d]/g,'')" @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                            <el-form-item label="开孔尺寸(mm)：" class="hidenM">
                                <div class="srcmm">高：</div>
                                <el-input v-model="form.kaikongHeight" onkeyup="value=value.replace(/[^\d]/g,'')" @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                            <el-form-item label="质保年限：">
                                <el-input v-model="form.zhibaoYears" @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                            <el-form-item label="参考价格：" class="ckj">
                                <el-input v-model="form.referPrice" @keyup.enter.native="cancelEnter()" ></el-input>元/
                                <el-input v-model="form.referPriceUnit" ><i slot="suffix">套</i @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                            <el-form-item label="灯具尺寸(mm)：" class="hidenM">
                                <div class="srcmm">直径：</div>
                                <el-input v-model="form.lumZhijing" onkeyup="value=value.replace(/[^\d]/g,'')" @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                            <el-form-item label="开孔尺寸(mm)：" class="hidenM">
                                <div class="srcmm">直径：</div>
                                <el-input v-model="form.kaikongZhijing" onkeyup="value=value.replace(/[^\d]/g,'')" @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                            <el-form-item label="点间距(mm)：">
                                <el-input v-model="form.pointDist" @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                            <el-form-item label="控制位数/像素段：">
                                <el-input v-model="form.controlBits" @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                            <el-form-item label="照射长度(m)：">
                                <el-input v-model="form.zhaosheLong" @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                            <el-form-item label="视看范围(m)：">
                                <el-input v-model="form.viewRange" @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                            <el-form-item label="安装距离(m)：">
                                <el-input v-model="form.installDist" @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                            <el-form-item label="图像大小(m)：">
                                <el-input v-model="form.picSize" @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                            <el-form-item label="镜头范围：">
                                <el-input v-model="form.picRange" @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                        </div>
                        <div class="lists2">
                             <el-form-item label="产品标签：">
                                <el-input type="textarea" v-model="form.lumTag" @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                             <el-form-item label="效果描述：">
                                <el-input type="textarea" v-model="form.effectDesc" @keyup.enter.native="cancelEnter()" ></el-input>
                            </el-form-item>
                        </div>
                        <div class="lists3">
                            <el-form-item label="灯具外观图：" class="sce" :required="true">
                                <template>
                                    <div v-if="form.waiGuanPic" class="el-upload-list--picture-card avatar-uploader" >
                                                <img class="el-upload-list__item-thumbnail avatar" :src="ImgPath +  form.waiGuanPic" alt="" style="width:100px;height:100px;float:left;margin-bottom:17px">
                                                <span class="el-upload-list__item-actions" style="width:100px;height:100px">
                                                    <span
                                                    class="el-upload-list__item-delete"
                                                    @click="RemoveWaiGuan()">
                                                    <i class="el-icon-delete"></i>
                                                    </span>
                                                </span>
                                    </div>
                                    <el-upload v-else  class="avatar-uploader" 
                                        :action="uploadUrl" 
                                        :show-file-list="false" 
                                        :headers ="headers"
                                        :on-success="handleAvatarSuccessWaiGuan"
                                        accept="image/gif,image/jpeg,image/jpg,image/bmp,image/png"
                                        :before-upload="beforeAvatarUploadImg">
                                        <i class="el-icon-plus avatar-uploader-icon"></i>
                                    </el-upload>
                                </template>
                            </el-form-item>
                            <el-form-item label="灯具尺寸图：" class="sce">
                                <template>
                                    <div v-if="form.chiCunPic" class="el-upload-list--picture-card avatar-uploader" >
                                                <img class="el-upload-list__item-thumbnail avatar" :src="ImgPath +  form.chiCunPic" alt="" style="width:100px;height:100px;float:left;margin-bottom:17px">
                                                <span class="el-upload-list__item-actions" style="width:100px;height:100px">
                                                    <span
                                                    class="el-upload-list__item-delete"
                                                    @click="RemoveChiCun()">
                                                    <i class="el-icon-delete"></i>
                                                    </span>
                                                </span>
                                    </div>
                                    <el-upload v-else class="avatar-uploader" 
                                        :action="uploadUrl" 
                                        :show-file-list="false" 
                                        :headers ="headers"
                                        :on-success="handleAvatarSuccessChicun" 
                                        accept="image/gif,image/jpeg,image/jpg,image/bmp,image/png"
                                        :before-upload="beforeAvatarUploadImg">
                                        <i  class="el-icon-plus avatar-uploader-icon"></i>
                                    </el-upload>
                                </template>
                            </el-form-item>
                            <el-form-item label="配光曲线图：" class="sce">
                                <template>
                                    <div v-if="form.peiGuangPic" class="el-upload-list--picture-card avatar-uploader" >
                                                <img class="el-upload-list__item-thumbnail avatar" :src="ImgPath +  form.peiGuangPic" alt="" style="width:100px;height:100px;float:left;margin-bottom:17px">
                                                <span class="el-upload-list__item-actions" style="width:100px;height:100px">
                                                    <span
                                                    class="el-upload-list__item-delete"
                                                    @click="RemovePeiGuang()">
                                                    <i class="el-icon-delete"></i>
                                                    </span>
                                                </span>
                                    </div>
                                    <el-upload v-else class="avatar-uploader" 
                                        :action="uploadUrl" 
                                        :show-file-list="false" 
                                        :headers ="headers"
                                        :on-success="handleAvatarSuccessPeiGuang" 
                                        accept="image/gif,image/jpeg,image/jpg,image/bmp,image/png"
                                        :before-upload="beforeAvatarUploadImg">
                                        <i  class="el-icon-plus avatar-uploader-icon"></i>
                                    </el-upload>
                                </template>
                            </el-form-item>
                            <el-form-item label="案例：" class="sce">
                                <template>
                                    <div v-if="form.anLiPic" >
                                        <div class="el-upload-list--picture-card avatar-uploader" >
                                                <!--视频 -->
                                                <video v-if="form.anLiPic.substr(form.anLiPic.lastIndexOf('.')+1,form.anLiPic.length) == 'mp4'" :src="ImgPath +  form.anLiPic" class="avatar" controls="controls">您的浏览器不支持视频播放</video>
                                                <!--图片 -->
                                                <img v-else class="el-upload-list__item-thumbnail avatar" :src="ImgPath +  form.anLiPic" alt="" style="width:100px;height:100px;float:left;margin-bottom:17px">
                                                <span class="el-upload-list__item-actions" style="width:100px;height:100px">
                                                    <span
                                                    class="el-upload-list__item-delete"
                                                    @click="RemoveAnli()">
                                                    <i class="el-icon-delete"></i>
                                                    </span>
                                                </span>
                                        </div>
                                    </div>
                                    <el-upload v-else class="avatar-uploader" 
                                        :action="uploadUrl" 
                                        :show-file-list="false" 
                                        :headers ="headers"
                                        :on-success="handleAvatarSuccessAnli" 
                                        accept="image/gif,image/jpeg,image/jpg,image/bmp,image/png,audio/mp4,video/mp4"
                                        :before-upload="beforeAvatarUploadImgOrVideo">
                                        <i  class="el-icon-plus avatar-uploader-icon"></i>
                                    </el-upload>
                                </template>
                            </el-form-item>
                            <el-form-item label="可配附件(光学)图：" class="sce">
                                <template>
                                    <div v-if="form.fuJianPic" class="el-upload-list--picture-card avatar-uploader" >
                                                <img class="el-upload-list__item-thumbnail avatar" :src="ImgPath +  form.fuJianPic" alt="" style="width:100px;height:100px;float:left;margin-bottom:17px">
                                                <span class="el-upload-list__item-actions" style="width:100px;height:100px">
                                                    <span
                                                    class="el-upload-list__item-delete"
                                                    @click="RemoveFuJian()">
                                                    <i class="el-icon-delete"></i>
                                                    </span>
                                                </span>
                                    </div>
                                    <el-upload v-else class="avatar-uploader" 
                                        :action="uploadUrl" 
                                        :show-file-list="false" 
                                        :headers ="headers"
                                        :on-success="handleAvatarSuccessKePeiFuJianGuang" 
                                        accept="image/gif,image/jpeg,image/jpg,image/bmp,image/png"
                                        :before-upload="beforeAvatarUploadImg">
                                        <i class="el-icon-plus avatar-uploader-icon"></i>
                                    </el-upload>
                                </template>
                            </el-form-item>
                            <el-form-item label="可配附件(安装)图：" class="sce">
                                <template>
                                    <div v-if="form.fuJianInstallPic" class="el-upload-list--picture-card avatar-uploader" >
                                                <img class="el-upload-list__item-thumbnail avatar" :src="ImgPath +  form.fuJianInstallPic" alt="" style="width:100px;height:100px;float:left;margin-bottom:17px">
                                                <span class="el-upload-list__item-actions" style="width:100px;height:100px">
                                                    <span
                                                    class="el-upload-list__item-delete"
                                                    @click="RemoveKePeiFuJian()">
                                                    <i class="el-icon-delete"></i>
                                                    </span>
                                                </span>
                                    </div>
                                    <el-upload v-else  class="avatar-uploader" 
                                        :action="uploadUrl"
                                        :show-file-list="false" 
                                        :headers ="headers"
                                        :on-success="handleAvatarSuccessKePeiFuJian" 
                                        accept="image/gif,image/jpeg,image/jpg,image/bmp,image/png"
                                        :before-upload="beforeAvatarUploadImg">
                                        <i class="el-icon-plus avatar-uploader-icon"></i>
                                    </el-upload>
                                </template>
                            </el-form-item>
                            <el-form-item label="安装说明：" class="sce">
                                <template>
                                    <div v-if="form.anZhuangDesc" class="el-upload-list--picture-card avatar-uploader" >
                                        <i  class="avatar-uploader-icon el-icon-notebook-2"></i>
                                                <span class="el-upload-list__item-actions" style="width:100px;height:100px">
                                                    <span
                                                    class="el-upload-list__item-delete"
                                                    @click="RemoveAnZhuangDesc()">
                                                    <i class="el-icon-delete"></i>
                                                    </span>
                                                </span>
                                    </div>
                                    <el-upload v-else class="avatar-uploader" 
                                        :action="uploadPdfUrl" 
                                        :show-file-list="false" 
                                        :headers ="headers"
                                        :on-success="handleAvatarSuccessPdfDes" 
                                        :before-upload="beforeAvatarUploadPdf1">
                                        <i class="el-icon-plus avatar-uploader-icon"></i>
                                    </el-upload>
                                </template>
                            </el-form-item>
                            <el-form-item label="IES文件：" class="sce">
                                <template>
                                    <div v-if="form.iesFile" class="el-upload-list--picture-card avatar-uploader" >
                                        <i  class="avatar-uploader-icon el-icon-notebook-2"></i>
                                                <span class="el-upload-list__item-actions" style="width:100px;height:100px">
                                                    <span
                                                    class="el-upload-list__item-delete"
                                                    @click="RemoveIes()">
                                                    <i class="el-icon-delete"></i>
                                                    </span>
                                                </span>
                                    </div>
                                    
                                    <el-upload v-else class="avatar-uploader" 
                                        :action="uploadPdfUrl" 
                                        :show-file-list="false" 
                                        :headers ="headers"
                                        :on-success="handleAvatarSuccessIes" 
                                        :before-upload="beforeAvatarUploadIES">
                                        <i class="el-icon-plus avatar-uploader-icon"></i>
                                    </el-upload>
                                </template>
                            </el-form-item>
                            <el-form-item label="灯具规格书：" class="sce">
                                <template>
                                    <div v-if="form.guiGePdf" class="el-upload-list--picture-card avatar-uploader" >
                                        <i  class="avatar-uploader-icon el-icon-notebook-2"></i>
                                                <span class="el-upload-list__item-actions" style="width:100px;height:100px">
                                                    <span
                                                    class="el-upload-list__item-delete"
                                                    @click="RemoveGuige()">
                                                    <i class="el-icon-delete"></i>
                                                    </span>
                                                </span>
                                    </div>
                                    <el-upload v-else class="avatar-uploader" 
                                        :action="uploadPdfUrl" 
                                        :show-file-list="false" 
                                        :headers ="headers"
                                        :on-success="handleAvatarSuccessGuiGe" 
                                        :before-upload="beforeAvatarUploadPdf2">
                                        <i class="el-icon-plus avatar-uploader-icon"></i>
                                    </el-upload>
                                </template>
                            </el-form-item>
                        </div>    
                        <el-form-item class="botm">
                            <el-button @click="back()">取消</el-button> 
                            <el-button @click="save()" type="primary">保存</el-button>  
                        </el-form-item>
                    </el-form>
                </div>
            </div>
        </div>
     </div>
</template>
<script>
import backHeader from '@/views/common/backHeader.vue'
export default {
    data(){
        return{
            fullscreenLoading:false,
            modelList:[],
            lampTypeList:[],
            seriesInfo:{},
            uploadUrl:'',
            headers: {
                "Authorization": localStorage.getItem('token')
            },
            dengjuyanseList:[],
            dengjucaizhiList:[],
            guangyuanpinpaiList:[],
            ipdengjiList:[],
            sewenyanseList:[],
            kongzhifangshiList:[],
            form:{
                seriesId: this.$route.query.seriesId,
                seriesName:'',
                anLiPic:'',  //案例图
                anZhuangDesc:'', //pdf说明 
                brandId:'',
                // brandName:'',
                chiCunPic:'', //尺寸图
                // colorFlagId:'', //色温分类
                colorTemp:'',  //色温色彩
                controlBits: '', //显示屏类控制位数或像素段 ,
                controlTypeStr:'', //控制方式
                // createName:'', //创建人姓名
                effectDesc:'',//效果描述
                electric:'', //是否携带电源 string
                // fengzhuangType:'', //封装类型
                fuJianInstallPic:'', //可配附件安装图
                fuJianPic:'', //可配附件 光学 图
                guangShuai:'', //70%光衰承诺
                guangTongLiang:'', //光通量 
                // guangTongLiangMax (integer, optional): 光通量最大 ,
                // guangTongLiangMin (integer, optional): 光通量最小 ,
                iesFile:'', //ies
                guiGePdf:'', //规格pdf
                installDist:'', //安装距离
                ipGrade:'', //ip等级
                isPublic: 0 , //是否发布: 0-未发布 1-发布
                kaikongHeight:'', //开孔尺寸 高
                kaikongLong:'', //长
                kaikongWidth:'', //宽
                kaikongZhijing:'',//直径
                lightAngle:'',//光束角
                // lightAngleMax:'',
                // lightAngleMin:'',
                lightBrand:'', //光源品牌
                lightPower:'',//光源功率
                lightType:'LED',//光源种类
                lumColor:'', //灯具颜色
                lumHeight:'', //灯具尺寸（高）
                lumLong:'', //灯具尺寸（长
                lumWidth:'', //宽
                lumZhijing:'' ,//直径
                lumMaterial:'', //灯具材质
                lumPower:'',//灯具功率
                lumPowerDictId:'',//功率类型ID
                lumPowerMax:'', //功率最大
                lumPowerMin:'' , //功率最小
                lumTag:'', //产品标签
                lumType:'', //灯具类型id
                lumTypeName:'', //灯具类型name
                modelCode:'', //厂家灯具编号
                modelId:'', //型号id
                modelName:'',//型号name
                peiGuangPic:'' , //配光曲线图
                picRange:'',//镜头范围
                picSize:'',//图像大小
                pointDist:'' ,//显示屏，点间距
                ra:'',//显指Ra
                referPrice:'', //参考价
                referPriceUnit:'套', //参考价单位
                surfaceTemp:'', //表面最高温度
                // testModelCode:'',//测试字段型号编码 
                viewRange:'',//视看范围
                voltage:'', //电压
                waiGuanPic:'', //灯具外观图
                weight:'',//重量
                xiaoLv:'',//灯具效率
                zhaosheLong:'',//照射长度
                zhibaoYears:'', //质保年限
                zhijiaHeight:'', // 支架高度
            },
            forminputEdit:{
                user:'',
                color:'',//颜色
                name:'填写时直接显示',
                name1:'填写时直接显示',
                IP:'',//ip等级
                lightBrand:'',//光源品牌
                temperature:'',//色温颜色
                beamAngle:'',//光束角
                control:'',//控制方式
                brandimg:''//
            },
            colors:[{
                lampName:'白',  
            },{
                lampName:'红',
            },{
                lampName:'黑'
            }],
            lightSpecies:[
                {name:'光源1'},
                {name:'光源2'},
            ],
            ips:[
                {ip:'1'},
                {ip:'2'}
            ],
            lightBrands:[
                {name:'品牌1'},
                {name:'品牌2'}
            ],
            colorTemperature:[
                {name:'颜色1'},
                {name:'颜色2'},
            ],
            beamAngles:[
                {name:'30'}
            ],
            controls:[
                {name:'方式1'},
                {name:'方式2'}
            ],
            colors2:[],//选中的颜色
        }
    },
    components: {
        backHeader
    },
    created(){
        var seriesId = this.$route.query.seriesId
        var lumTypeId = this.$route.query.lumTypeId
        if(lumTypeId != null && lumTypeId != '' && !isNaN(lumTypeId)){
            this.form.lumType = parseInt(lumTypeId)
        }
        var id = this.$route.query.id
        let self = this
        if(seriesId != null && seriesId != ''&& seriesId != 'undefined'){
            this.$http.get('/api/series/'+seriesId,{},function(res){
                if(res.success){
                    self.seriesInfo = res.data
                }
            })
            
            //加载灯具型号
            this.$http.postObj('/api/model/json',{seriesId:seriesId,modelName:''},function(res){
                if(res.success){
                    self.modelList = res.data
                }
            })
            
        }
        this.uploadUrl = this.$http.getSignUrl('/api/files/upload',{type:'image'})
        this.uploadPdfUrl = this.$http.getSignUrl('/api/files/upload',{type:'wordpdf'})

        //加载灯具类型
        this.$http.get("/api/lampTypes/json", {}, function(res) {
            if (res.success) {
                self.lampTypeList = res.data;
            }
        });
        
            //灯具颜色：
            this.$http.get("/api/dictTypeAllList", {indexPinyin:'chanpinkexuanyanse'}, function(res) {
                if (res.success) {
                    self.dengjuyanseList = res.data;
                }
            });
            //灯具材质：
            this.$http.get("/api/dictTypeAllList", {indexPinyin:'chanpinkexuancaizhi'}, function(res) {
                if (res.success) {
                    self.dengjucaizhiList = res.data;
                }
            });
            //光源品牌：
            this.$http.get("/api/dictTypeAllList", {indexPinyin:'chanpinkexuanguangyuanpinpai'}, function(res) {
                if (res.success) {
                    self.guangyuanpinpaiList = res.data;
                }
            });

            //IP等级：
            this.$http.get("/api/dictTypeAllList", {indexPinyin:'chanpinkexuanIPdengji'}, function(res) {
                if (res.success) {
                    self.ipdengjiList = res.data;
                }
            });
            //色温颜色：
            this.$http.get("/api/dictTypeAllList", {indexPinyin:'chanpinkexuansewenyanse'}, function(res) {
                if (res.success) {
                    self.sewenyanseList = res.data;
                }
            });
            //控制方式：
            this.$http.get("/api/dictTypeAllList", {indexPinyin:'chanpinkexuankongzhifangshi'}, function(res) {
                if (res.success) {
                    self.kongzhifangshiList = res.data;
                }
            });


        if(id != null && id != ''){
            this.form.id = id
            this.initData()
        }
    },
    mounted(){
        document.onkeydown = function(e) {
            var ev = (typeof event!= 'undefined') ? window.event : e;
            if(ev.keyCode == 13) {
                return false;
            }
        }
    },
    methods:{
        cancelEnter(){
            return false
        },
        proving(e) {
            var weight = this.form.weight
            if(weight != null && weight != "" &&  !isNaN(weight)){
                this.form.weight = parseFloat(weight).toFixed(3)
            }

        },
        openFullScreen1() {
            this.fullscreenLoading=this.$loading({lock: true,text: '拼命加载中',});
        },
        initData(){
                //编辑
                let self = this
                this.$http.get('/api/stlamps/'+this.form.id,{},function(res){
                    if(res.success){
                        self.form = res.data
                        self.form.modelNameBak = res.data.modelName
                        console.log(self.form)
                    }
                })
        },
        //外观图
        handleAvatarSuccessWaiGuan(res){
            if(res.success){
                this.form.waiGuanPic = res.data.savePath
                this.$message({
                    type:'success',
                    message:'文件上传成功!'
                })
            }
                this.fullscreenLoading.close();
        },
        RemoveWaiGuan(){
            this.form.waiGuanPic = ''
        },
        //灯具尺寸图
        handleAvatarSuccessChicun(res){
             if(res.success){
                this.form.chiCunPic = res.data.savePath
                this.$message({
                    type:'success',
                    message:'文件上传成功!'
                })
            }
                this.fullscreenLoading.close();
        },
        RemoveChiCun(){
            this.form.chiCunPic = ''
        },
        //配光曲线图
        handleAvatarSuccessPeiGuang(res){
             if(res.success){
                this.form.peiGuangPic = res.data.savePath
                this.$message({
                    type:'success',
                    message:'文件上传成功!'
                })
            }
                this.fullscreenLoading.close();
        },
        RemovePeiGuang(){
            this.form.peiGuangPic = ''
        },
        //案例图
        handleAvatarSuccessAnli(res){
             if(res.success){
                this.form.anLiPic = res.data.savePath
                this.$message({
                    type:'success',
                    message:'文件上传成功!'
                })
            }
                this.fullscreenLoading.close();
        },
        RemoveAnli(){
            this.form.anLiPic = ''
        },
        //可配附件 光学图
        handleAvatarSuccessKePeiFuJianGuang(res){
            if(res.success){
                this.form.fuJianPic = res.data.savePath
                this.$message({
                    type:'success',
                    message:'文件上传成功!'
                })
            }
                this.fullscreenLoading.close();
        },
        RemoveFuJian(){
            this.form.fuJianPic = ''
        },
        //可配附件安装图
        handleAvatarSuccessKePeiFuJian(res){
            if(res.success){
                this.form.fuJianInstallPic = res.data.savePath
                this.$message({
                    type:'success',
                    message:'文件上传成功!'
                })
            }
                this.fullscreenLoading.close();
        },
        RemoveKePeiFuJian(){
            this.form.fuJianInstallPic = ''
        },
        handleAvatarSuccessPdfDes(res){
            if(res.success){
                this.form.anZhuangDesc = res.data.savePath
                this.$message({
                    type:'success',
                    message:'文件上传成功!'
                })
            }
                this.fullscreenLoading.close();
        },
        RemoveAnZhuangDesc(){
            this.form.anZhuangDesc = ''
        },
        handleAvatarSuccessIes(res){
            if(res.success){
                this.form.iesFile = res.data.savePath
                this.$message({
                    type:'success',
                    message:'文件上传成功!'
                })
            }
                this.fullscreenLoading.close();
        },
        RemoveIes(){
            this.form.iesFile = ''
        },
        handleAvatarSuccessGuiGe(res){
            if(res.success){
                this.form.guiGePdf = res.data.savePath
                this.$message({
                    type:'success',
                    message:'文件上传成功!'
                })
            }
                this.fullscreenLoading.close();
        },
        RemoveGuige(){
            this.form.guiGePdf = ''
        },

        beforeAvatarUploadImg(file){
            var testmsg=/^image\/(jpeg|png|jpg|gif)$/.test(file.type)
	          const isLt4M = file.size / 1024/1024 <=1//图片大小不超过2MB
	          if (!testmsg) {
	            this.$message.error('上传图片格式错误!');
	            return
	          }
	          if(!isLt4M) {
	            this.$message.error('上传图片大小不能超过 1M!');
	            return
              }
              if(testmsg  && isLt4M){
                  this.openFullScreen1()
              }
	          return testmsg  && isLt4M
        },
        beforeAvatarUploadImgOrVideo(file){
            var fix = file.name.substr(file.name.lastIndexOf('.')+1,file.name.length)
	          const isLt4M = file.size / 1024/1024 <=10//图片大小不超过10MB
	          
            if(fix != "jpeg" || fix != 'png' || fix != 'mp4' || fix != 'jpg' || fix != 'gif'){
	            this.$message.error('上传图片或视频格式错误!');
	            return
	          }
	          if(!isLt4M) {
	            this.$message.error('上传图片或视频大小不能超过 10M!');
	            return
              }
              if(testmsg  && isLt4M){
                  this.openFullScreen1()
              }
	          return testmsg  && isLt4M
        },
        beforeAvatarUploadPdf1(file){
            if(file.name.substr(file.name.lastIndexOf('.')).toLocaleLowerCase() != '.pdf' && file.name.substr(file.name.lastIndexOf('.')).toLocaleLowerCase() != '.dwg' && file.name.substr(file.name.lastIndexOf('.')).toLocaleLowerCase() != '.rar'){
                this.$message.error('安装说明格式错误 pdf|dwg|rar!');
                return false
            }
                  this.openFullScreen1()
            return true
        },
        beforeAvatarUploadPdf2(file){
            if(file.name.substr(file.name.lastIndexOf('.')).toLocaleLowerCase() != '.pdf' && file.name.substr(file.name.lastIndexOf('.')).toLocaleLowerCase() != '.rar'){
                this.$message.error('灯具规格书格式错误 要求pdf|rar!');
                return false
            }
                  this.openFullScreen1()
            return true
        },
        beforeAvatarUploadIES(file){
            if(file.name.substr(file.name.lastIndexOf('.')).toLocaleLowerCase() != '.ies' && file.name.substr(file.name.lastIndexOf('.')).toLocaleLowerCase() != '.rar'){
                this.$message.error('ies文件格式错误! ies|rar');
                return false
            }
                  this.openFullScreen1()
            return true
        },
        back(){
            let self = this
                        if(self.$route.query.type != null && self.$route.query.type == 'update'){
                            self.$router.push('/maintenance?id='+self.form.seriesId+"&request="+self.$route.query.request)
                        }else{
                            self.$router.push('/release')
                        }
        },
        save(){
            let self = this;
            this.form.brandId = this.seriesInfo.brandId;
            if(this.form.modelName == ''){
                this.$message.error('请输入灯具型号')
                return false
            }
            if(this.form.lumType == ''){
                this.$message.error('请输入灯具类型')
                return false
            }
            if(this.form.lumPower == ''){
                this.$message.error('请输入灯具功率')
                return false
            }
            // if(this.form.colorTemp == ''){
            //     this.$message.error('请输入色温颜色')
            //     return false
            // }
            // if(this.form.lightAngle == ''){
            //     this.$message.error('请输入光束角')
            //     return false
            // }
            if(this.form.controlTypeStr == ''){
                this.$message.error('请输入控制方式')
                return false
            }
            if(this.form.waiGuanPic == ''){
                this.$message.error('请上传灯具外观图')
                return false
            }
            if(this.form.id != null && this.form.id != ''){
                if(this.form.modelName != this.form.modelNameBak){
                    this.form.modelId = '' //c.修改产品信息时，若灯具型号修改，传递参数时modelId不传；
                }
                this.$http.putObj("/api/stlamps", this.form, function(res) {
                    if (res.success) {
                        self.$message({
                            message: "修改成功！",
                            type: "success"
                        });
                        if(self.$route.query.type != null && self.$route.query.type == 'update'){
                            self.$router.push('/maintenance?id='+self.form.seriesId+"&request="+self.$route.query.request)
                        }else{
                            self.$router.push('/release')
                        }
                    }else{
                        self.$message.error(res.data)
                    }
                });
            }else{
                this.$http.postObj("/api/stlamps", this.form, function(res) {
                    if (res.success) {
                        self.$message({
                            message: "新增成功！",
                            type: "success"
                        });
                        self.$router.push('/maintenance?id='+self.form.seriesId+"&request="+self.$route.query.request)
                    }else{
                        self.$message.error(res.data)
                    }
                });
            }
        },
        blurModelName(){
            this.form.modelId = ''
        },
         //灯具颜色
        setModel: function(item,index) {
        },
        handleSelect(item) {
            this.form.modelId = item.modelId
        },
        querySearch(queryString, cb) {
            let self = this
            var id = this.$route.query.seriesId
            var temp = []
             this.$http.postObj('/api/model/json',{seriesId:id,modelName:queryString},function(res){
                if(res.success){
                    self.modelList = res.data
                    for(var i = 0;i<res.data.length;i++){
                        temp.push({
                            value:res.data[i].modelName,
                            modelId:res.data[i].id
                        })
                    }
                    cb(temp);
                }
            })
        },
         //灯具颜色
        setCol: function(item,index) {
            // if(item.delFlag == '1'){
            //     this.colors[index].delFlag= "0"
            // }else{
            //     this.colors[index].delFlag= "1"
            // }
            // let tempval = '';
            // for(var i = 0;i<this.colors.length;i++){
            //     if(this.colors[i].delFlag == "1"){
            //     tempval+=this.colors[i].lampName + ","
            //     }
            // }
            // tempval=tempval.substr(0,tempval.length-1)
            var tempval = ''
            if(this.form.lumColor != ''){
                tempval = this.form.lumColor + ',' +item.dictCont
            }else{
                tempval = item.dictCont
            }
            this.form.lumColor = tempval
        },
        setCol1(item,index){
            var tempval = ''
            if(this.form.lumMaterial != ''){
                tempval = this.form.lumMaterial + ',' +item.dictCont
            }else{
                tempval = item.dictCont
            }
            this.form.lumMaterial = tempval
        },
        //ip等级
        setIp: function(item,index) {
            var tempval = ''
            if(this.form.ipGrade != ''){
                tempval = this.form.ipGrade + ',' +item.dictCont
            }else{
                tempval = item.dictCont
            }
            this.form.ipGrade = tempval
        },
        //光源品牌
        setlightBrand: function(item,index) {
            var tempval = ''
            if(this.form.lightBrand != ''){
                tempval = this.form.lightBrand + ',' +item.dictCont
            }else{
                tempval = item.dictCont
            }
            this.form.lightBrand = tempval
        },
        //色温颜色
        setTemperature: function(item,index) {
            var tempval = ''
            if(this.form.colorTemp != ''){
                tempval = this.form.colorTemp + ',' +item.dictCont
            }else{
                tempval = item.dictCont
            }
            this.form.colorTemp = tempval
        },
        //控制方式
        setControl: function(item,index) {
            var tempval = ''
            if(this.form.controlTypeStr != ''){
                tempval = this.form.controlTypeStr + ',' +item.dictCont
            }else{
                tempval = item.dictCont
            }
            this.form.controlTypeStr = tempval
        },
    }
}
</script>
<style lang="scss"  rel="stylesheet/scss">
.inline-input.el-autocomplete{
    width: 100%;
}
.administerCont2{
    min-height: 100%;
    -webkit-transition: margin-left .28s;
    transition: margin-left .28s;
    margin-left: 240px;
    position: relative;
    background: #f7f7f7;
    margin-top: 80px;
    padding: 15px;
    .input_edit{
        background-color: #ffffff;
        -webkit-box-shadow: 0px 0px 27px 0px rgba(91, 101, 161, 0.09);
        box-shadow: 0px 0px 27px 0px rgba(91, 101, 161, 0.09);
        border-radius: 4px;
        border: solid 1px #eeeeee;
        padding: 16px;
        height: 100%;
    }
}
.input_edit{
    .font26{
        text-align: center;
        margin-bottom: 12px;  
    }
    .el-form-item{
        margin:0 0 12px 0;
        &.botm{
            text-align: center;
            width: 100%;
        }
        .el-form-item__label{
            font-size: 12px;
            padding: 0 3px 0 0;
        }
        .el-form-item__content{
            width: calc(100% - 122px);
            position: relative;
            span.ason{
                position: absolute;
                left: -8px;
            }
        }
    }
    .lists{
        overflow: hidden;
        .el-form-item{
            width: 25%;
            float: left;
        }
    }
    .lists1{
        overflow: hidden;
        .el-form-item{
            width: 25%;
            float: left;
            &.hidenM{
                .el-form-item__label{
                    opacity: 0;
                }
                .srcmm{
                    width: 36px;
                    font-size: 12px;
                    float: left;
                    text-align: right;
                }
                .el-input{
                    width: calc(100% - 36px);
                }
            }
            &.showM{
                .srcmm{
                    width: 36px;
                    font-size: 12px;
                    float: left;
                    text-align: right;
                }
                .el-input{
                    width: calc(100% - 36px);
                }
            }
            &.ckj{
                font-size: 12px;
                .el-form-item__content{
                    .el-input{
                        width: calc(50% - 20px);
                    }
                }
            }
        }
        
    }
    .lists2{
        .el-form-item{
            width: 100%;
        }
    }
    .lists3{
        overflow: hidden;
        .el-form-item{
            width: 25%;
             .avatar-uploader .el-upload {
                border: 1px dashed #d9d9d9;
                border-radius: 6px;
                cursor: pointer;
                position: relative;
                overflow: hidden;
            }
            .avatar-uploader .el-upload:hover {
                border-color: #409EFF;
            }
            .avatar-uploader-icon {
                font-size: 28px;
                color: #8c939d;
                width: 100px;
                height: 100px;
                line-height: 100px;
                text-align: center;
            }
            .avatar {
                width: 100px;
                height: 100px;
                display: block;
            } 
        }
    }

}
</style>